<!--该画面是：维护项目维护画面 -->
<template>
  <el-dialog
    id="bakMaintainProject"
    v-loading="dataLoading"
    element-loading-spinner="el-icon-loading"
    element-loading-background="rgba(255, 255, 255, 0.7)"
    :title="title"
    :visible.sync="openSheet"
    width="1200px"
    :destroy-on-close="true"
    :close-on-click-modal="false"
    :before-close="cancel"
  >
    <!-- 项目计划信息 -->
    <projectplanbase-info :project-plan-base-information="projectPlanBaseInformation" />
    <!-- 项目计划信息 -->

    <div class="DescriptionTitle">{{ $t('projectMaintainTitle') }}</div>

    <el-table ref="table1" v-loading="loading" :data="projectMaintainList" border :style="{ height: tableHeightStyle }" :default-sort="{ prop: 'quote_date', order: 'ascending' }" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="40" :selectable="rowSelectable" />
      <el-table-column :label="$t('projectMaintainOrderNo')" prop="order_no" width="100" />
      <el-table-column :label="$t('quoteNo')" prop="quote_no" width="100" />
      <el-table-column :label="$t('projectMaintainName')" prop="project_name" width="250" show-tooltip-when-overflow />
      <el-table-column :label="$t('projectMaintainStatus')" prop="project_status_desc" align="center" width="80" />
      <el-table-column :label="$t('projectMaintainSalesDate')" prop="sales_date" align="center" width="120" />
      <el-table-column :label="$t('projectMaintainSalesAmount')" prop="sales_amount" align="right" width="120" />
      <el-table-column :label="$t('projectMaintainObj')" prop="procurement_obj" align="right" width="120" />
      <el-table-column :label="$t('projectMaintainaffect')" prop="procurement_affect" align="right" width="120" />
      <el-table-column :label="$t('projectMaintainQuoteDays')" prop="quoted_days" align="right" width="130" />
      <el-table-column :label="$t('projectMaintainQuoteHours')" prop="quoted_hours" align="right" width="130" />
      <el-table-column :label="$t('projectMaintainBudgetHours')" prop="bugdget_hours" align="right" width="130" />
      <el-table-column :label="$t('projectMaintainReserveHours')" prop="reserve_hours" align="right" width="130" />
      <el-table-column :label="$t('projectMaintainNote')" prop="note" min-width="220" show-tooltip-when-overflow />
      <el-table-column :label="$t('createdUser')" prop="created" width="100" />
      <el-table-column :label="$t('createdDate')" prop="created_date" width="160" />
      <el-table-column :label="$t('createdProgram')" prop="created_program" width="200" show-overflow-tooltip />
      <el-table-column :label="$t('updatedUser')" prop="updated" width="100" />
      <el-table-column :label="$t('updatedDate')" prop="updated_date" width="160" />
      <el-table-column :label="$t('updatedProgram')" prop="updated_program" width="200" show-overflow-tooltip />
      <el-table-column :label="$t('operate')" align="center" width="180" class-name="fixed-width" fixed="right">
        <template slot-scope="scope">
          <el-button size="mini" :disabled="scope.row.project_status !== 'O'" type="text" icon="el-icon-edit" @click="updateMaintainProject(scope.row)">{{ $t('modifyBtn') }}</el-button>
          <el-dropdown v-more size="mini" trigger="click" @command="command => handleCommand(command, scope.row)">
            <span class="el-dropdown-link">
              <i class="el-icon-d-arrow-right el-icon--right" />{{ $t('moreBtn') }}
            </span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item v-auth="[]" :disabled="scope.row.project_status !== 'O'" command="handleDelete" icon="el-icon-delete">{{ $t('deleteBtn') }}</el-dropdown-item>
              <el-dropdown-item v-auth="[]" :disabled="scope.row.project_status !== 'O'" command="handleRelease" icon="el-icon-unlock">{{ $t('releaseBtn') }}</el-dropdown-item>
              <el-dropdown-item v-auth="[]" :disabled="scope.row.project_status !== 'O'" command="handleSplit" icon="el-icon-scissors">{{ $t('splitBtn') }}</el-dropdown-item>
              <el-dropdown-item v-auth="[]" :disabled="scope.row.project_status !== 'R' || scope.row.status === 'C'" command="handleClose" icon="el-icon-close">{{ $t('closeBtn') }}</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </template>
      </el-table-column>
    </el-table>
    <div style="display: flex; justify-content: space-between;">
      <div style="margin-top: 5px;">
        <el-button size="medium" type="text" icon="el-icon-plus" @click="createMaintainProject">{{ $t('addBtn') }}</el-button>
        <el-button size="medium" type="text" :disabled="!canBatchDelete" icon="el-icon-delete" @click="handleBatchDelete">{{ $t('batchDeleteBtn') }}</el-button>
      </div>
      <div>
        <pagination
          v-show="detailtotal > 0"
          :pager-count="5"
          :total="detailtotal"
          :page.sync="detailParams.page"
          :limit.sync="detailParams.page_size"
          @pagination="getProjectMaintainList"
        />
      </div>
    </div>

    <div slot="footer" class="dialog-footer">
      <el-button @click="cancel">{{ $t('cancel') }}</el-button>
    </div>

    <el-backtop target="#bakMaintainProject" />
    <projectmaintain-maintain-sheet ref="projectMaintainMaintainSheet" @refreshList="getProjectMaintainList" />
    <projectmaintain-maintain-split ref="projectMaintainMaintainSplit" @refreshList="getProjectMaintainList" />
  </el-dialog>
</template>

<script>
import { getProjectMaintainListApi, deleteProjectMaintainApi, BatchdeleteMaintainProjectApi, releaseMaintainProjectBaseApi, closeMaintainProjectBaseApi } from '@/views/project/projectmaintain/api/projectmaintain.api';
import projectplanbaseInfo from '@/views/projectbase/projectplanbase/components/projectplanbase-info.vue';
import ProjectmaintainMaintainSheet from './projectmaintain-maintain-sheet.vue';
import ProjectmaintainMaintainSplit from './projectmaintain-maintain-split.vue';

export default {
  components: { projectplanbaseInfo, ProjectmaintainMaintainSheet, ProjectmaintainMaintainSplit },
  data() {
    return {
      title: this.$t('projectMaintainTitle'),
      dataLoading: false,
      loading: false,
      openSheet: false,
      canBatchDelete: false,
      projectMaintainList: [],
      multipleSelection: [],
      detailtotal: 0,
      detailParams: {
        projectPlanFK: undefined,
        page: 1,
        page_size: 10
      },
      options: [],
      projectPlanId: undefined,
      projectPlanBaseInformation: {},
      tableHeightStyle: '',
      originalTableHeight: ''
    }
  },

  methods: {
    async openSheetDialog(data) {
      this.dataLoading = true;
      this.reset();
      this.projectPlanBaseInformation = data
      this.projectPlanId = data.id;
      this.getProjectMaintainList();
      this.openSheet = !this.openSheet;
      this.dataLoading = false;
    },
    handleCommand(command, row) {
      switch (command) {
        case 'handleDelete':
          this.handleDelete(row);
          break;
        case 'handleRelease':
          this.handleRelease(row);
          break;
        case 'handleSplit':
          this.handleSplit(row)
          break;
        case 'handleClose':
          this.handleClose(row)
          break;
        default:
          break;
      }
    },
    // 获取维护项目
    async getProjectMaintainList() {
      this.detailParams.projectPlanFK = this.projectPlanId
      this.loading = true
      var resp = await getProjectMaintainListApi({ ...this.detailParams })
      if (resp.success) {
        this.projectMaintainList = resp.data.results
        this.detailtotal = resp.data.count
      } else {
        this.projectMaintainList = []
      }
      this.updateTableHeight();
      this.loading = false
    },
    updateTableHeight() {
      this.tableHeightStyle = ''
      // 确保表格数据渲染完成
      this.$nextTick(() => {
        setTimeout(() => {
          // 再次确保 DOM 已经更新
          this.tableHeightStyle = this.$refs.table1.$el.scrollHeight + 'px';
        }, 100); // 增加 100ms 的延迟
      });
    },
    // 定义勾选框状态
    rowSelectable(row) {
      return row.project_status === 'O';
    },
    // 多选操作
    handleSelectionChange(value) {
      this.multipleSelection = value;
      // 只有勾选了数据，才允许批量删除
      if (value.length > 0) {
        this.canBatchDelete = true
      } else {
        this.canBatchDelete = false
      }
    },
    cancel() {
      this.openSheet = !this.openSheet;
      this.$emit('refreshList');
      this.reset()
    },
    reset() {
      this.detailtotal = 0
      this.detailParams = {
        projectPlanFK: undefined,
        page: 1,
        page_size: 10
      };
      this.quoteList = []
    },
    // 新增按钮
    createMaintainProject() {
      this.$refs.projectMaintainMaintainSheet.openSheetDialog(this.projectPlanBaseInformation)
    },
    // 修改按钮
    updateMaintainProject(row) {
      this.$refs.projectMaintainMaintainSheet.openSheetDialog(this.projectPlanBaseInformation, row)
    },
    // 拆分按钮
    handleSplit(row) {
      this.$refs.projectMaintainMaintainSplit.openSheetDialog(this.projectPlanBaseInformation, row)
    },
    // 删除按钮
    async handleDelete(row) {
      if (await this.ConfirmMessageBox(this.$t('projectMaintainTitle'), this.$t('dataDeleteConfirm', { title: this.$t('projectMaintainOrderNo'), value: row.order_no }), 'warning') === 'cancel') {
        return
      }
      const resp = await deleteProjectMaintainApi(row.id);
      if (resp.success) {
        this.targaMessage(this.$t('deleteSuccess', {
          title: this.$t('projectMaintainOrderNo'),
          value: row.order_no
        }));
        this.getProjectMaintainList();
      } else {
        this.targaMessageBox(this, resp.msg);
      }
    },
    // 生效按钮
    async handleRelease(row) {
      if (await this.ConfirmMessageBox(this.$t('projectMaintainTitle'), this.$t('dataReleaseConfirm', { title: this.$t('projectMaintainOrderNo'), value: row.order_no }), 'warning') === 'cancel') {
        return
      }
      const resp = await releaseMaintainProjectBaseApi(row.id);
      if (resp.success) {
        this.targaMessage(this.$t('releaseSuccess', {
          title: this.$t('projectMaintainOrderNo'),
          value: row.order_no
        }));
        this.getProjectMaintainList();
      } else {
        this.targaMessageBox(this, resp.msg);
      }
    },
    // 关闭按钮
    async handleClose(row) {
      if (await this.ConfirmMessageBox(this.$t('projectMaintainTitle'), this.$t('dataCloseConfirm', { title: this.$t('projectMaintainOrderNo'), value: row.order_no }), 'warning') === 'cancel') {
        return
      }
      const resp = await closeMaintainProjectBaseApi(row.id);
      if (resp.success) {
        this.targaMessage(this.$t('closeSuccess', {
          title: this.$t('projectMaintainOrderNo'),
          value: row.order_no
        }));
        this.getProjectMaintainList();
      } else {
        this.targaMessageBox(this, resp.msg);
      }
    },
    // 批量删除功能
    async handleBatchDelete() {
      if (await this.ConfirmMessageBox(this.$t('projectMaintainTitle'), this.$t('dataBatchDeleteConfirm'), 'warning') === 'cancel') {
        return
      }
      const resp = await BatchdeleteMaintainProjectApi({ ids: this.multipleSelection.map(item => item.id) })
      if (resp.success) {
        this.targaMessage(this.$t('maintainProjectBatchDeleteSuccess'));
        this.getProjectMaintainList();
      } else {
        this.targaMessageBox(this, resp.msg);
        return;
      }
    }
  }
};
</script>

<style scoped>
@import "~@/views/projectbase/projectcss/project.css";
</style>
